import 'package:flutter/material.dart';
import 'package:fluttertoast/fluttertoast.dart';
import 'package:kxy_flutter_app/auth.dart';
import 'package:kxy_flutter_app/helper/http.dart';
import 'package:kxy_flutter_app/model/course.dart';
import 'package:kxy_flutter_app/view/course/course_column_item_widget.dart';
import 'package:kxy_flutter_app/view/root/view_model/navigation_model.dart';
import 'package:line_awesome_icons/line_awesome_icons.dart';
import 'package:provider/provider.dart';

class HomeCourseWidget extends StatefulWidget {
  final List<CourseProfile> courseList;

  HomeCourseWidget({
    Key key,
    this.courseList,
  }) : super(key: key);

  @override
  _HomeCourseWidgetState createState() => _HomeCourseWidgetState();
}

class _HomeCourseWidgetState extends State<HomeCourseWidget> {
  List<CourseProfile> courseList;
  int page = 2;

  var boxShadow = [
    BoxShadow(
      color: Color.fromRGBO(240, 240, 240, 1),
      offset: Offset(1, 1),
    ),
    BoxShadow(
      color: Color.fromRGBO(240, 240, 240, 1),
      offset: Offset(-1, -1),
    ),
  ];

  @override
  void initState() {
    super.initState();
    courseList = widget.courseList;
  }

  @override
  Widget build(BuildContext context) {
    var header = Container(
      alignment: Alignment.centerLeft,
      margin: EdgeInsets.only(top: 20),
      padding: EdgeInsets.symmetric(horizontal: 10),
      child: Row(
        mainAxisAlignment: MainAxisAlignment.spaceBetween,
        children: [
          Text(
            '最新课程',
            style: TextStyle(
              fontSize: 18,
              fontWeight: FontWeight.bold,
            ),
          ),
          moreBtn(),
        ],
      ),
    );

    return Column(
      children: [
        header,
        body(),
      ],
    );
  }

  Widget moreBtn() {
    return GestureDetector(
      child: Row(children: [
        Text(
          '查看更多',
          style: TextStyle(
            fontSize: 16,
            color: Colors.black54,
          ),
        ),
        Icon(
          Icons.chevron_right,
          size: 20,
          color: Colors.black54,
        ),
      ]),
      onTap: () {
        var navModel = Provider.of<NavigationModel>(context, listen: false);
        navModel.changeSelectIndex(3);
      },
    );
  }

  Widget changeBtn(double width) {
    var icon = Icon(
      LineAwesomeIcons.refresh,
      color: Colors.black54,
      size: 16,
    );

    var text = Text(
      ' 换一换',
      style: TextStyle(
        fontSize: 12,
        color: Colors.black54,
      ),
    );

    return Container(
      width: width,
      height: 40,
      alignment: Alignment.center,
      child: Container(
        width: 100,
        height: 40,
        child: ClipRRect(
          borderRadius: BorderRadius.circular(20),
          child: FlatButton(
            onPressed: refresh,
            padding: EdgeInsets.all(0),
            color: Color.fromRGBO(240, 240, 240, 1),
            child: Row(
              mainAxisAlignment: MainAxisAlignment.center,
              crossAxisAlignment: CrossAxisAlignment.start,
              children: [icon, text],
            ),
          ),
        ),
      ),
    );
  }

  Widget body() {
    var innerWidth = MediaQuery.of(context).size.width - (20 /* margin */ + 16 /* padding */ + 15 /* wrap spacing */);
    List<Widget> widgetList = new List<Widget>();
    courseList.forEach((item) {
      var widget = CourseColumnItemWidget(course: item, width: innerWidth);
      widgetList.add(widget);
    });
    widgetList.add(changeBtn(innerWidth));

    return Container(
      decoration: BoxDecoration(
        borderRadius: BorderRadius.circular(5),
        color: Colors.white,
        boxShadow: boxShadow,
      ),
      margin: EdgeInsets.fromLTRB(10, 10, 10, 0),
      padding: EdgeInsets.symmetric(horizontal: 8, vertical: 10),
      child: Wrap(
        spacing: 15,
        runSpacing: 15,
        children: widgetList,
      ),
    );
  }

  Future refresh() async {
    var res = await Http.instance.post('/train-app/courseapp/indexCourseChange', params: {
      'courseCount': 4,
      'page': page,
      'userId': Auth.instance.userId,
    });

    if (res.code == 200) {
      var list = res.data as List;
      if (list.length == 0) {
        page = 1;
        await refresh();
        return;
      }

      setState(() {
        courseList = list.map((e) => CourseProfile.fromJson(e)).toList();
        page++;
      });
    } else {
      Fluttertoast.showToast(msg: res.msg);
    }
  }
}
